<!-- 路由跳转 -->
<template>
  <div class="home">
    <router-view></router-view>
    <div class="router-box">
      <router-link class="rou-link" to="/Index"><i class="iconfont">&#xe62d;</i>首页</router-link>
      <router-link class="rou-link" to="/Classification"><i class="iconfont">&#xe610;</i>分类</router-link>
      <router-link class="rou-link" to="/Cart"><i class="iconfont">&#xe70b;</i>购物车</router-link>
      <router-link class="rou-link" to="/My"><i class="iconfont">&#xe62f;</i>我的</router-link>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Home',
}
</script>
<style scoped lange="less">
.router-box {
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  height: .98rem;
  display: flex;
  justify-content: space-evenly;
  font-size:.22rem;
  background: #fff;

}
.router-box .rou-link{
  width:25%;
  color:#000;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}
.router-box .router-link-active{
  color:#FF734C;
}
.iconfont{
  margin:0 2rem;
  font-size:.4rem;
}
</style>
